<template>
  <div class="product-display">
    <MenuBar></MenuBar>
    <div class="main w">
      <div :class="pcOrWx?'titlePhoneNo':'title'">产品展示</div>
      <ProductMain></ProductMain>
    </div>
    <Footers></Footers>
  </div>
</template>

<script>

  import MenuBar from '../components/menuBar'
  import Footers from '../components/footers'
  import ProductMain from '../components/product/productMain'
  import {mapState, mapActions} from "vuex"



  export default {
    name: "product-display",
    components: {
      MenuBar,
      Footers,
      ProductMain,
    },
    computed: {
      ...mapState({
        pcOrWx: (state) => state.config.PC_OR_WX,
      })
    },
    data(){
      return{}
    },
    methods:{},
    mounted(){},
  }
</script>

<style scoped lang="less">
.product-display{
  width: 100%;
  height: 100%;
  .main{
    background-color: #fff;
    .title{
      height: 80px;
      border-bottom: 1px solid #ccc;
      margin:0 10px;
      box-sizing: border-box;
      font-size: 18px;
      line-height: 80px;
      color: #4bb2df;
      padding-left: 36px;
    }
    .titlePhoneNo{
      display: none;
    }

  }
}
</style>

